<template>
	<div class="weekend">
		<p class="title">周末去哪儿</p>
		<ul>
			<li class="item border-bottom" v-for="item in weekendList" :key="item.id">
		        <div class="item-img-wrapper">
		          <img class="item-img" :src="item.imgUrl" />
		        </div>
		        <div class="item-info">
		          <p class="item-title hidden-space-text">{{item.title}}</p>
		          <p class="item-desc hidden-space-text">{{item.desc}}</p>
		        </div>
		    </li>
		</ul>
	</div>
</template>

<script type="text/javascript">
export default {
	name:"Weekend",
	props:['weekendList'],
	data(){
		return {
			msg:"weekend"
		};
	}
}	
</script>

<style type="text/css" scoped>
	.weekend{

	}
	.weekend .title{
		line-height: 0.8rem;background-color: #eee;text-indent: 0.2rem;
	}
	.weekend .item{

	}
	.weekend .item .item-img-wrapper{
		overflow: hidden; height: 0;padding-bottom: 37.09%
	}
	.weekend .item .item-img-wrapper .item-img{
		width: 100%;
	}
	.weekend .item .item-info{
		padding: 0.1rem;
	}
	.weekend .item .item-info .item-title{
		line-height: .54rem;font-size: .32rem;
	}
	.weekend .item .item-info .item-desc{
		line-height: 0.4rem;color: #ccc;
	}
</style>